<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <!--移动设备优先：添加响应式布局-->
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <!-- Bootstrap 的 CSS 文件 -->
    <link th:href="@{/plugins/bootstrap/css/bootstrap.css}" rel="stylesheet" crossorigin="anonymous">
    <link th:href="@{/css/main.css}" rel="stylesheet" crossorigin="anonymous">
    <link th:href="@{/css/login.css}" rel="stylesheet" crossorigin="anonymous">
    <title>用户管理-登录</title>
</head>
<body>
<main class="form-login text-center">
    <form th:action="@{/checkLogin}" method="post">
        <h1 class="h3 mb-3 fw-normal">请登录</h1>

        <div class="form-floating">
            <input type="text" class="form-control" id="floatingInput" placeholder="用户名/邮箱" name="username">
            <label for="floatingInput">用户名/邮箱</label>
        </div>
        <div class="form-floating">
            <input type="password" class="form-control" id="floatingPassword" placeholder="登录密码" name="passwd">
            <label for="floatingPassword">登录密码</label>
        </div>

        <div class="checkbox mb-3">
            <label>
                <input type="checkbox" value="remember-me"> 记住我
            </label>
        </div>
        <button class="w-100 btn btn-lg btn-primary" type="submit">登录</button>
        <div class="register">
            <span>没有账号，去 </span><a th:href="@{/register}">注册</a>
        </div>
        <p class="mt-5 mb-3 text-muted">&copy; 2020–2021</p>
    </form>
</main>
</body>
<!-- 选项 1：包含 Popper 的 Bootstrap 集成包 -->
<script th:src="@{/plugins/bootstrap/js/bootstrap.bundle.js}" crossorigin="anonymous"></script>
</html>